<!doctype html>
<html lang="en">
  <head>
    <script src="../../helpers/header.js" type="module"></script>
    <script src="index.js" type="module"></script>
    <link rel="stylesheet" href="./index.css" />
  </head>
  <body>
    <div id="game">
      <div id="player">
        <h2>You</h2>
        <img src="images/rock.png" alt="Rock" id="rock" class="choice" />
        <img src="images/paper.png" alt="Paper" id="paper" class="choice" />
        <img src="images/scissors.png" alt="Scissors" id="scissors" class="choice" />
      </div>
      <div id="computer">
        <h2>Computer</h2>
        <img src="" alt="Question" id="computer-choice" class="c-choice" />
      </div>
    </div>
    <div id="result">
      <p>Choose your weapon!</p>
    </div>
    <div id="scoreboard">
      <table>
        <th>You</th>
        <th>Computer</th>
        <tr>
          <td id="playerScore"></td>
          <td id="computerScore"></td>
        </tr>
      </table>
      <div>
        <button type="button" id="btnReset">Rest</button>
      </div>
    </div>
  </body>
</html>
